<template>
  <div class="basicLayout">
  <Layout style="min-height: 100vh">
    <Header style="position: sticky; top: 0; z-index: 100; width: 100%">
      <GlobalHeader />
    </Header>

    <Content style="padding: 16px; background: #eee; min-height: calc(100vh - 128px)">
      <RouterView />
    </Content>

    <Footer style="padding: 0">
      <GlobalFooter />
    </Footer>
  </Layout>
  </div>

</template>

<script setup lang="ts">
import { RouterView } from 'vue-router'
import { Layout } from 'ant-design-vue'
import GlobalHeader from '@/components/GlobalHeader.vue'
import GlobalFooter from '@/components/GlobalFooter.vue'
import { healthCheck } from '@/api/healthController.ts'

const { Header, Content, Footer } = Layout

healthCheck().then((res)=>{
  console.log(res)
})
</script>


<style scoped>
/* Ensure content area adapts on small screens */
:deep(.ant-layout-header) {
  padding: 0;
}

.content-wrapper {
  width: 100%;
}

</style>


